html
  .self-page
    height 100%
    max-width 480PX
    margin 0 auto


.self-page

  height 100vh
  overflow hidden
  box-sizing border-box
  display flex
  flex-direction column
  background url(https://image-hosting.xiaoxili.com/img/img/20200910/8eada4aa54057ba19b89fc45bf06da1f-8af948.png)  center top no-repeat
  background-size 100% auto

.page-title
  text-align center
  font-size 16px
  font-weight 400
  color #fff
  line-height 44px
  height 44px

.main-wrap
  height calc(100% - 94px)
  display flex
  flex-direction column
  padding-top 1px


.user-wrap
  padding 56px 0 10px
  .avatar
    display block
    margin 0 auto
    width 98px
    height 98px
    padding 4px
    border-radius 50%
    overflow hidden
    background #fff
    box-shadow 0 6px 15px rgba(140, 140, 140, 0.3)

  .avatar-image
    display block
    width 100%
    height 100%
    border-radius 50%
  
  .nick-name
    margin-top 6px
    font-size 20px
    line-height 1.4
    color #464D5C
    text-align center
  
  .address-text
    font-size 16px
    line-height 1.4
    color #464D5C
    text-align center

.login-wrap
  flex 1
  display flex
  flex-direction column
  justify-content center
  align-items center

  .logo-image
    display block
    width 232px
    height 210px
    margin 0 auto -10px
    opacity 0.1
  .login-button
    display block
    margin 0 auto 6px
    background: linear-gradient(180deg, #FFBE85 0%, #FF238B 100%);
    width 138px
    line-height 44px
    border-radius 18px
    font-size 14px
    color #fff

  .login-tips
    font-size 12px
    text-align center
    color rgba(70, 77, 92, 0.49)
.avatar-wrap
  height calc(100% - 220px)
  padding-bottom 10px